<div id="waiter-login-container" class="page-wrapper">

    <div class="header">
        <div class="title">登录</div>
    </div>

    <div class="login-body">

        <form action="/api/waiter/login" method="post" onsubmit="return onSubmitClicked()">
            <div class="login-panel">
                <div class="line border-bottom">
                    <span class="addon icon-me"></span>
                    <input id="username" class="input-control user-id" autocomplete="off" name="username" type="text" placeholder="请输入ID" />
                </div>
                <div class="line border-bottom">
                    <span class="addon icon-locker"></span>
                    <input id="password" class="input-control user-passwd" autocomplete="off" type="password" name="password" id="password" value="" placeholder="请输入密码" />
                </div>
                <!--<div class="line"><span class="attention">忘记密码，请向您的管理员咨询...</span></div>-->
                <div class="line"><input class="btn-login" type="submit" value="登录"/></div>
            </div>
        </form>

    </div>
    <script>
        function onSubmitClicked(){
            console.log('onSubmitClicked');
            var username = $('#username').val();
            var passwd = $('#password').val();
            console.log(username + ' ' + passwd);

            var data = {
                username:username,
                password:passwd
            }

            $.ajax({
                url:'/api/waiter/login',
                dataType:'json',
                type:'post',
                data:JSON.stringify(data),
                contentType:'application/json;charset=utf-8'
            }).done(function(data){
                console.log(data);

                if(data && data.success){
                    $('#waiter-login-container').remove();
                    initWaiter();
                }

            }).fail(function(data){

            });

            return false;
        }
    </script>
</div>